<style lang="stylus" rel="stylesheet/stylus" src="./reconciliationBusinessChannel.styl"></style>
<template>
    <div class="pureNewLogContent realTimeDataClass accQuery" :style="{width:pageWidth}">
        <div class="right_header" :style='{"background":this.$store.getters.theme[5]}'>
            <div class="listName" :style='{"color":this.$store.getters.theme[6]}'>
                <i class="icon iconfont">&#xe7d8;</i>
                <span>{{title}}</span>
            </div>

            <div class="right_header_time">
                <div class="block">
                    <span>选择日期范围：</span>
                    <el-date-picker
                            size='small'
                            v-model="date"
                            type="daterange"
                            align="left"
                            placeholder="选择日期范围"
                            @change='dateChange'
                            :picker-options="pickerOptions"></el-date-picker>
                </div>
            </div>
        </div>
        <div class="right_content">
            <div class="realTimeServiceTable">
                <div class="realTimeServiceTableHeader" :style='{"background":this.$store.getters.theme[5]}'>
                    <span :style='{"color":this.$store.getters.theme[6]}' class="zoomIn animated">汇总数据</span>
                    <el-button type="primary" size="mini" class="excel"  @click="excel(reconciliationBusinessAllTabelHead,reconciliationBusinessAllData,'财务工具-汇总数据')" :style='{"background": this.$store.getters.theme[0],"borderColor":this.$store.getters.theme[1]}'>
                        <i class="icon iconfont">&#xe7f0;</i> 导出excel
                    </el-button>
                </div>
                <div class="realTimeServiceTableBody">
                    <template>
                        <el-table :data="reconciliationBusinessAllData" border style="width: 100%">
                            <el-table-column label="金额(￥)" align="center">
                                <el-table-column prop="addcash" label="总计" align="center"></el-table-column>
                                <el-table-column prop="astoreAddcash" label="astore" align="center"></el-table-column>
                                <el-table-column prop="tstoreAddcash" label="tstore" align="center"></el-table-column>
                                <el-table-column prop="nstoreAddcash" label="ntore" align="center"></el-table-column>
                                <el-table-column prop="gstoreAddcash" label="gtore" align="center"></el-table-column>
                                <el-table-column prop="webAddcash" label="WEB直充" align="center"></el-table-column>
                            </el-table-column>
                            <el-table-column label="外部订单数" align="center">
                                <el-table-column prop="odernum" label="总计"  align="center"></el-table-column>
                                <el-table-column prop="astoreOdernum" label="astore"  align="center"></el-table-column>
                                <el-table-column prop="tstoreOdernum" label="tstore" align="center"></el-table-column>
                                <el-table-column prop="nstoreOdernum" label="ntore"  align="center"></el-table-column>
                                <el-table-column prop="gstoreOdernum" label="gtore" align="center"></el-table-column>
                                <el-table-column prop="webOdernum" label="WEB直充"  align="center"></el-table-column>
                            </el-table-column>
                        </el-table>
                    </template>
                </div>
            </div>

            <div class="realTimeServiceTable">
                <div class="realTimeServiceTableHeader" :style='{"background":this.$store.getters.theme[5]}'>
                    <span :style='{"color":this.$store.getters.theme[6]}' class="zoomIn animated">详细数据</span>
                    <el-button type="primary" size="mini" class="excel"  @click="excel(reconciliationBusinessDetailTabelHead,reconciliationBusinessDetailDataAll,'财务工具-详细数据')" :style='{"background": this.$store.getters.theme[0],"borderColor":this.$store.getters.theme[1]}'>
                        <i class="icon iconfont">&#xe7f0;</i> 导出excel
                    </el-button>
                </div>
                <div class="realTimeServiceTableBody">
                    <template>
                        <el-table :data="reconciliationBusinessDetailData" border style="width: 100%">
                            <el-table-column prop="day" label="日期" align="center"></el-table-column>
                            <el-table-column label="金额(￥)" align="center">
                                <el-table-column prop="addcash" label="总计" align="center"></el-table-column>
                                <el-table-column prop="astoreAddcash" label="astore" align="center"></el-table-column>
                                <el-table-column prop="tstoreAddcash" label="tstore" align="center"></el-table-column>
                                <el-table-column prop="nstoreAddcash" label="ntore" align="center"></el-table-column>
                                <el-table-column prop="gstoreAddcash" label="gtore" align="center"></el-table-column>
                                <el-table-column prop="webAddcash" label="WEB直充" align="center"></el-table-column>
                            </el-table-column>
                            <el-table-column label="外部订单数" align="center">
                                <el-table-column prop="odernum" label="总计"  align="center"></el-table-column>
                                <el-table-column prop="astoreOdernum" label="astore"  align="center"></el-table-column>
                                <el-table-column prop="tstoreOdernum" label="tstore" align="center"></el-table-column>
                                <el-table-column prop="nstoreOdernum" label="ntore"  align="center"></el-table-column>
                                <el-table-column prop="gstoreOdernum" label="gtore" align="center"></el-table-column>
                                <el-table-column prop="webOdernum" label="WEB直充"  align="center"></el-table-column>
                            </el-table-column>
                        </el-table>
                    </template>
                </div>
                <div class="block realTimeServicePage">
                    <el-pagination
                            @size-change="handleSizeChange"
                            @current-change="handleCurrentChange"
                            :current-page="currentPage"
                            :page-sizes="pageSizes"
                            :page-size="pageSize"
                            layout="total, sizes, prev, pager, next, jumper"
                            :total="dataTotal"></el-pagination>
                </div>
            </div>



        </div>
        <a href="" :download="xlsxTitle+'.xlsx'" id="hf"></a>
    </div>
</template>
<script src="./reconciliationBusinessChannel.js"></script>